<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>餐馆选择</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" />
<style> 
 <body>{
            font-family: Arial, sans-serif;
            background-color: #f4f4f4;
            margin: 0;
            padding: 0;
        }

        .navbar {
            background-color: #d2a679;
            overflow: hidden;
            border-bottom: 2px solid #ccc;
        }

        .navbar a {
            float: left;
            display: block;
            color: #000;
            text-align: center;
            padding: 14px 20px;
            text-decoration: none;
            font-size: 17px;
        }

        .navbar a:hover {
            background-color: #ddd;
            color: black;
        }

        .navbar a.active {
            background-color: #ff704d;
            color: white;
        }

        .container {
            max-width: 800px;
            margin: 20px auto;
            padding: 20px;
            background-color: #fff;
            border-radius: 5px;
            box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
        }
    
        body {
            font-family: Arial, sans-serif;
            background-color: #f4f4f4;
            margin: 0;
            padding: 0;
        }

        .container {
            max-width: 800px;
            margin: 20px auto;
            padding: 20px;
            background-color: #fff;
            border-radius: 5px;
            box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
        }

        h1 {
            margin-bottom: 20px;
            color: #333;
            text-align: center;
        }

        .dish {
            border: 1px solid #ccc;
            border-radius: 5px;
            padding: 10px;
            margin-bottom: 10px;
        }

        .dish h2 {
            margin-top: 0;
        }

        .dish-status {
            margin-top: 10px;
        }

        .finished-dish {
            background-color: #dff0d8;
        }

        .out-of-stock {
            text-decoration: line-through;
            color: #ccc;
        }
        
        table {  
            border-collapse: collapse;  
            width: 100%;  
        }  
        th, td {  
            text-align: left;  
            padding: 8px;  
        }  
        tr:nth-child(even) {background-color: #f2f2f2;}  
        </body>
    </style>
</head>
<h1>欢迎来到餐馆选择页面</h1>  
  
<div id="restaurantList">  
    <!-- 餐馆列表将动态插入到这里 -->  
    
</div>  
  
<button onclick="selectRestaurant()">选择餐馆</button>  
  <a href="FRIST.jsp">选择餐馆</a>
<p id="selectedRestaurant">选择的餐馆: <span id="selectedRestaurantName"></span></p>  
  
<script src="script.js"></script>  
</body>  
</html>
